<template>
    <div class="page">
        <span class="title">回收站</span>
        <el-button type="warning" style="float: right; margin-right: 120px" @click="clearAll">
            <i class="iconfont myicon-huishouzhan"></i> 清空回收站
        </el-button>
        <el-table 
            :data="deletedMsgList"
            border
            style="width: 65%; margin-top: 40px"
            :row-class-name="tableRowClassName">
            <el-table-column
                prop="tittle"
                label="问卷标题"
                width="420">
            </el-table-column>
            <el-table-column
                prop="creTime"
                label="创建时间"
                width="150">
            </el-table-column>
            <el-table-column
                prop="pubTime"
                label="发布时间"
                width="150">
            </el-table-column>
            <el-table-column
                prop="ansCount"
                label="回收量"
                width="80">
            </el-table-column>
            <el-table-column label="操作">
                <template slot-scope="scope">
                    <el-button type="success" @click="handleRestore(scope.$index, scope.row)" size="small">恢复</el-button>
                    <el-button type="danger" @click="handleDel(scope.$index, scope.row)" size="small">彻底删除</el-button>
                </template>
            </el-table-column>
        </el-table>
    </div>
</template>

<script>
/* eslint-disable no-unused-vars */
import {getDeletedQuestionnaireMsg, restoreQuestionnaire, delQuestionnaireComplete, clearRecycleBin} from '../../api'
export default ({
    data() {
        return {
            uid: '',
            deletedMsgList: []
        }
    },
    mounted() {
        this.initData();
    },
    methods: {
        initData() {
            if (this.$store.state.uid == 0) {
				this.$message({
					message: '请先登录',
					type: 'warning'
				})
				this.$router.push('/');
			}
            this.uid = this.$store.state.uid;
            getDeletedQuestionnaireMsg(this.uid).then(res => {
                res.elemList.forEach(item => {
                    console.log(item);
                    let q = {};
                    q.id = item.id;
                    q.tittle = item.title;
					q.creTime = item.creation_time.substring(0, 10);
                    if (item.publish_time != null) {
                        q.pubTime = item.publish_time.substring(0, 10);
                    } else {
                        q.pubTime = '未发布';
                    }
                    q.ansCount = item.answer_count;
                    this.deletedMsgList.push(q);
                })
            });
        },
        handleRestore(index, row) {
            restoreQuestionnaire(this.uid, row.id).then(res => {
                console.log(res);
                const x = res.error_code;
				switch (x){
					case -1:alert("未知错误");break;
					case 0:
                        this.$message({
							message: '恢复成功',
							type: 'success'
						});
						this.$delete(this.deletedMsgList, index);
						break;
					case 1:alert("请求参数错误");break;
					case 2:alert("用户不存在");break;
					case 3:alert("问卷不存在");break;
				}
            })
        },
        handleDel(index, row) {
            delQuestionnaireComplete(this.uid, row.id).then(res => {
                console.log(res);
                const x = res.error_code;
				switch (x){
					case -1:alert("未知错误");break;
					case 0:
                        this.$message({
							message: '彻底删除成功',
							type: 'success'
						});
						this.$delete(this.deletedMsgList, index);
						break;
					case 1:alert("请求参数错误");break;
					case 2:alert("用户不存在");break;
					case 3:alert("问卷不存在");break;
				}
            })
        },
        clearAll() {
            clearRecycleBin(this.uid).then(res => {
                console.log(res);
                const x=res.error_code;
				switch (x){
					case -1:alert("未知错误");break;
					case 0:
                        this.$message({
							message: '清空完毕',
							type: 'success'
						});
						this.deletedMsgList.splice(0, this.deletedMsgList.length);
						break;
					case 1:alert("请求参数错误");break;
					case 2:alert("用户不存在");break;
					case 3:alert("问卷不存在");break;
				} 
            })
        },
        tableRowClassName({row, rowIndex}) {
            if (rowIndex % 2 == 0) {
                return 'purple-row';
            }
            return '';
        }
    },
    watch: {
        questionnaireList() {
            this.initData();
        }
    }
})
</script>

<style>
.title {
    font-size: 25px;
    font-weight: bold;
}
.el-table .purple-row {
    background: #ececfa;
}
</style>